<template>
	<view class="spread_box">
		<view class="spread_card" v-for="(item,index) in spread">
			<view class="card_top">
				<view class="top_name">{{item.name}}</view>
				<view class="top_time">{{item.time}}</view>
				<view class="top_line"></view>
			</view>
			<view class="card_middle">
				<view class="middle_detail">{{item.detail}}</view>
				<image :src="item.img"  ></image>
				<view class="middle_span">{{item.span}}</view>
			</view>
		</view>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				
			};
		},
		props: {
			spread: {
				type: Array,
				default: []
			},

		},
		mounted() {
		},
		methods: {
		}

	};
</script>

<style scoped lang="scss">
	.spread_box{
		padding: 48rpx 40rpx 48rpx  24rpx;
	.spread_card{
		.card_top{
			border-bottom: solid 1rpx #eee;
			//标题
			.top_name {
				font-size: 36rpx;
				font-weight: 600;
				color: #333;
				line-height: 56rpx;
			}
			//时间
			.top_time {
				padding-top: 20rpx;
				padding-bottom: 32rpx;
				font-size: 24rpx;
				color: #999999;
				line-height: 24rpx;
			}
		}
		//内容
		.card_middle{
			padding-top: 30rpx;
			.middle_detail{
				font-size: 28rpx;
				color: #666666;
				line-height: 48rpx;
				padding-bottom: 32rpx;
			}
			image{
				width: 702rpx;
				height: 320rpx;
				border-radius: 12rpx;
			}
			.middle_span{
				padding-top: 32rpx;
				font-size: 28rpx;
				color: #666666;
				line-height: 48rpx;
			}
		}
	}
}
</style>